import { Component, OnInit } from '@angular/core';
import { JsonApiService } from "app/core/api/json-api.service"; //http请求配置引入
import { Router, ActivatedRoute } from "@angular/router"; //路由引入
import { config } from '../../shared/smartadmin.config';

declare var $: any;
declare var Viewer: any;
@Component({
	selector: 'sa-install-img-check',
	templateUrl: './install-img-check.component.html',
	styleUrls: ['./install-img-check.component.css']
})
export class InstallImgCheckComponent implements OnInit {
	tableData:any[] = []; //table数据
	totalCount:number = 0; //分页总条数
	curPage:number = 1; //分页当前页
	pageSize:number = 10; //内置的分页每页条数
	
	tableParam:any = {
	    quality : '',
        searchKey: '',
        deviceId : '',
        carNumber: '',
        index : '',
	}
	// 查询参数
    startTime: any = ""; // 开始时间
    endTime: any = ""; // 结束时间
	constructor(private jsonApiService: JsonApiService, private router: Router, private activatedRoute: ActivatedRoute ) {
		activatedRoute.queryParams.subscribe(queryParams => {
			this.curPage = queryParams.nowPage||1;
		});
	}
	ngOnInit() {
		this.initCarTree();
		// this.load();
	}
	//table刷新
    refresh() {
    	this.load();
    }
	//表格搜索
	tableSearch() {
		this.curPage = 1;
		this.load();
	}
    //分页回调
    paginate(e){
        this.curPage = e.page + 1;
        this.pageSize = e.rows;
        this.load();
    }
	//初始化加载list数据
	load(){
		let data = {
			pageSize:this.pageSize,
			nowPage:this.curPage,
			parameters:{
			    quality : this.tableParam.quality,
                searchKey: common.stringTrim(this.tableParam.searchKey),
				deviceId : this.tableParam.deviceId,
				index : this.tableParam.index,
				startTime : this.startTime,
				endTime : this.endTime
			}
		}
		let reqdata = 'gridPager='+JSON.stringify(data);
		this.jsonApiService.http("carInstallAudit/list.html", reqdata).subscribe(data => {
			if(data.isSuccess){
				this.tableData = data.exhibitDatas;
				this.totalCount = data.recordCount;
			}else{
				this.jsonApiService.message(data.message);
			}
		})
	}
	//初始化车辆
    initCarTree() {
        System.import('script-loader!select2/dist/js/select2.min.js').then(() => {
            System.import('assets/js/select2-zh-CN.js').then(() => {
                var that = this;
                $("#carNumberSelect2").select2({
                    language: "zh-CN",
                    placeholder: "请选择",
                    minimumInputLength: 2,      //最少2个字符，select2才显示查询的内容
                    ajax: {
                        url: config.BaseURL + "stats/carListByCarNumber.html",
                        dataType: 'json',
                        delay: 50,
                        method: "POST",
                        xhrFields: { withCredentials: true },
                        data: function (params) {
                            return {
                                "carNumber": params.term // search term
                            };
                        },
                        processResults: function(data, params) {
							var options = new Array();
							// 小于10个数量才判断重复
							if(data.data.length<=10){
								let arr = []
								let sameCar = []
								// 判断相同的车牌号
								for (let index = 0; index < data.data.length; index++) {
									let car = data.data[index];
									if(arr.indexOf(car.carNumber)!=-1){
										sameCar.push(car.carNumber)
									}else{
										arr.push(car.carNumber);
									}
								}
								$(data.data).each(function(index, car) {
									if(sameCar.indexOf(car.carNumber)!=-1){
										options.push({
											id: car.deviceId,
											text: car.carNumber+"["+car.parentName+"]"
										})
									}else{
										options.push({
											id: car.deviceId,
											text: car.carNumber
										})
									}
								});
							}else{
								$(data.data).each(function(index, car) {
									options.push({
										id: car.deviceId,
										text: car.carNumber
									})
								});
							}
							return {
								results: options //获取查询后的结果
							};
						},
                        cache: true
                    },
                    templateResult: this.formatRepo
                }).on("select2:select", function (e) {
                    var data = e.params.data;
                    that.tableParam.deviceId = data.id;
                    if(data.text.indexOf('[') > 0){
						that.tableParam.carNumber = data.text.split('[')[0];
					} else {
						that.tableParam.carNumber = data.text;
					}
                });
            })
        })
	}
	//select2 格式回调函数
    formatRepo(state) {
        if (!state.id) { return state.text };
        var $state = $('<span><i class="fa fa-car green"></i>&nbsp;&nbsp;' + state.text + '</span>');
        return $state;
	}
	//清除车辆选中值
    del_carNumber() {
        this.tableParam.deviceId = '';
        this.tableParam.carNumber = '';
        var str = $("<span class='select2-selection__placeholder'>请选择</span>");
        $('#carNumberSelect2').val("");
        $("#select2-carNumberSelect2-container").empty();
        $("#select2-carNumberSelect2-container").attr("title", "");
        $("#select2-carNumberSelect2-container").prepend(str);
    }
	// 时间选择回调
	dateSelect(time) {
        this.startTime = time.startTime;
		this.endTime = time.endTime;
		if (time.startTime == "" || time.endTime == "") {
			this.dateNumber = 0;
		}
		this.tableSearch();
	}
	// 初始化1天的时间
	initDate(){
		let nowTime = new Date();
		this.endTime = common.getTimeMmss(nowTime);
		nowTime.setDate(nowTime.getDate() - 1);
		this.startTime = common.getTimeMmss(nowTime);
		this.specifyTime = {
			startTime: this.startTime,
			endTime: this.endTime,
		}
	}
	dateNumber = 0; //查看天数
	specifyTime: any;
	selectDate() {
		let nowTime = new Date();
		this.endTime = common.getTimeMmss(nowTime);
		nowTime.setDate(nowTime.getDate() - this.dateNumber);
		this.startTime = common.getTimeMmss(nowTime);
		this.specifyTime = {
			startTime: this.startTime,
			endTime: this.endTime,
		}
	}
	// 删除设备自检记录
	deleteRow(row){
		this.jsonApiService.confirm_message("此操作将永久删除数据,确认要删除?").then(() => {
			let reqdata = 'id=' + row.id;
			this.jsonApiService.http("carInstallAudit/deletedById.html", reqdata).subscribe(data => {
				this.jsonApiService.message(data.message);
				this.load();
			})
		})
	}
	// 数据导出
	exportData(){
			
		let data = {
			pageSize:this.pageSize,
			nowPage:this.curPage,
			parameters:{
			    quality : this.tableParam.quality,
                searchKey: common.stringTrim(this.tableParam.searchKey),
				deviceId : this.tableParam.deviceId,
				index : this.tableParam.index,
				startTime : this.startTime,
				endTime : this.endTime,
				export:"1"
			}
		}
		let timeCheck = common.correctTime(data.parameters, ['export'])
		if(!timeCheck.status){
			this.jsonApiService.message(timeCheck.message);
			return;
		}
		common.exprotDataFile(data, 'gridPager', config.BaseURL + 'carInstallAudit/list.html')	
    }
    imagesInfo: any =[]; //图片展示
    isViewer:boolean = false; //默认隐藏
    //显示图片组件
    viewer: any='';
    imageType:String = '';
    //查看照片
    open_img(row,val) {
        this.imageType = row.type;
        if(this.isViewer && $(".viewer-container").length >0){
            this.viewer.destroy();
        }
        this.imagesInfo = [];
        row.localImg = [];
        for(let c = 0; c < row.imageUrl.length; c++) {
            let localImg;
            if(row.imageUrl[c].indexOf('http') == -1) {
                if(row.imageUrl[c][0]  ==  '/') {
                    localImg = config.BaseURL + row.imageUrl[c].substr(1);
                } else {
                    localImg = config.BaseURL + row.imageUrl[c];
                }
            } else {
                localImg = row.imageUrl[c];
            }
            row.localImg.push(localImg);
        }
        this.imagesInfo = JSON.parse(JSON.stringify(row.localImg))
        val.show();
    }
    bigImg:any=''// 放大的图片
    //图片放大
    bigimg(modal,row){
        // modal.show();
        this.bigImg = row
        if(this.isViewer && $(".viewer-container").length >0){
            System.import('assets/js/viewer/viewer.js').then(
                ()=>{System.import('assets/js/viewer/bootstrap.bundle.min.js').then(
                    ()=>{System.import('assets/js/viewer/viewer.css').then(()=>{
                        this.showImg();
                    })
                })
            })
        }else{
            this.showImg();
        }

    }
    showImg(){
        var that = this;
        var imgList = $(".imagesInfo")[0];
        this.viewer = new Viewer(imgList, {
            url: 'src',
            title: function (image) {
                return image.alt + ' (' + (this.index + 1) + '/' + this.length + ')' ; 
            },
        });
        that.isViewer = true
    }
    //关闭图片弹窗
    imgClose(val) {
        val.hide();
    }
}